import React, { useState } from "react";
//this.state = {num:10}
//this.setState({num:88})

export default function UseState() {
  let [num, setNum] = useState(10);
  //num表示变量名称
  //setNum表示修改变量的方法
  //10表示默认值
  //num 只能被setNum控制
  let n = 999;
  let showNum  = (num1)=>{
    console.log(num1);
  }

  let change = ()=>{
    // setNum(num+2);
    // console.log(num);
    // setNum()
  
    //setNum(num+2);
    // setTimeout(()=>{
    //     console.log(num);
    // },2000)
      setNum((n)=>{
        // console.log(n);
        // console.log(num+2);
        showNum(n+2);
        return  n+2;

    })
   
  }
  return (
    <div>
      UseState
      <div>
        数据为{num}{" "}
        <button
          onClick={() => {
            setNum(num+1);
          }}
        >
          修改
        </button>
        <button onClick={()=>{
            change();
        }}>继续修改</button>
        <div>{n}</div>
        <button onClick={() => {
            n =1000;
        }}>修改N</button>
      </div>
    </div>
  );
}


